<template>
	<div style="height: calc(100vh - 30px); padding: 15px; background-color: white">
		<tiny-split v-model="split1" style="z-index: 9">
			<template #left>
				<div style="padding:5px;">
          <JButton @click="getList" icon="refresh">刷新</JButton>
          <div style="height: 10px"></div>
          <t-alert :closable="false" text="经办人列表" v-if="salesList.length > 0"></t-alert>
          <div style="padding-right: 10px; display: flex; margin-top: 20px; flex-wrap: wrap; flex-flow: wrap">
            <div :class="['item', currentSalesId === item.doId ? 'active' : '']" @click="chose(item)" v-for="(item, index) in salesList" :key="index">
              {{ item.doName }}
            </div>
          </div>
        </div>
			</template>
			<template #right>
				<div class="demo-split-pane">
          <j-grid ref="rplistRef" :columns="fields" all-fields click-row-to-select  />
          <div class="tc mt20">
          </div>
				</div>
			</template>
		</tiny-split>
	</div>
</template>
<script>
import tool from "@/utils/tool";
// 已完成
export default {
  name: 'ldsk',
  data () {
    return {
      split1: 0.1,
      salesList: [],
      detailList: [],
      currentSalesId: null,
      fields:[
        {type: 'index', width: 40},
        {field: 'buName', title: '终端名称', width: 220,align: 'left',visible: true,filter: true},
        {field: 'billDate', title: '票据日期', width: 100,visible: true,align: 'center'},
        {field: 'billNo', title: '票号', width: 130,visible: true,},
        {field: 'transTypeName', title: '业务类型', width: 100,visible: true,align: 'center'},
        {field: 'salesName', title: '业务员', width: 100,visible: true,align: 'center'},
        {field: 'doName', title: '经办人', width: 100,visible: true,align: 'center'},
        {field: 'arrearsReal', title: '应收金额', width: 100,subSum: true,visible: true},
        {field: 'leftAmount', title: '应收结余', width: 100,subSum: true,visible: true},
        {field: 'nowCheck', title: '本次收款', width: 100, subSum: true,visible: true},
        {field: 'yhAmount', title: '收款优惠', width: 90, subSum: true,visible: true},
        {field: 'cbyName', width: 100, title: '派单人',align: 'center',visible: true },
        {field: 'createdAt', width: 100, title: '派单时间',align: 'right',visible: true },
        {field: 'doneAt', width: 100, title: '审核时间',align: 'right',visible: true },
        {field: 'doneByName', width: 100, title: '审核人',align: 'center',visible: true },
      ]
    }
  },
  created() {
    this.getList()
  },
  methods: {
    sumBills () {
      let ret = []
      let gp = tool.xe.groupBy(this.detailList, 'buId')
      for(let buId in gp) {
        let arr = gp[buId]
        for (let i = 0; i < arr.length; i++) {
          let row = tool.xe.clone(arr[i])
          delete row._RID
          // if(i > 0) row.buName = ''
          ret.push(row)
        }
        let yh = tool.xe.sum(arr, 'yhAmount')
        let rp = tool.xe.sum(arr, 'nowCheck')
        let ye = tool.xe.sum(arr, 'ye')

        let arrearsReal = tool.xe.sum(arr, 'arrearsReal')
        let leftAmount = tool.xe.sum(arr, 'leftAmount')
        // 最后一行加合计
        ret.push({
          buId: arr[0].buId,
          buName: arr[0].buName,
          transTypeName: '小计',
          arrearsReal: arrearsReal?tool.xe.toFixed(arrearsReal,2):'',
          leftAmount: leftAmount?tool.xe.toFixed(leftAmount,2):'',
          nowCheck: rp?tool.xe.toFixed(rp,2):'',
          yhAmount: yh ? tool.xe.toFixed(yh,2) : '',
          ye: ye?tool.xe.toFixed(ye,2):'',
        })
      }
      this.$refs.rplistRef.setData(ret.length, ret)
    },
    getList () {
      tool.post('receipt/pdsales',{state: '已收款'}).then(ret => {
        if(ret.stat) {
          this.salesList = ret.data
        }
      })
    },
    chose (item) {
      this.currentSalesId = item.doId
      tool.post('receipt/pdlist',{doId: item.doId,state: '已收款'}).then(ret => {
        if(ret.stat) {
          this.detailList = ret.data.list
          this.sumBills()
        }
      })
    },
  }
}
</script>
<style scoped lang="scss">
.item {
	border: 1px solid gray;
	padding: 5px 10px;
	border-radius: 2px;
	margin-right: 15px;
	margin-bottom: 15px;
	font-size: 12px;
	font-weight: bold;
	color: #434a54;
	&:hover {
		cursor: pointer;
		border-color: var(--colorLeftMenu);
	}
	&.active {
		background-color: var(--colorLeftMenu);
		color: white;
	}
}
</style>